<script lang="ts" setup>
import { propTypes } from '@/utils/propTypes'
import { useDesign } from '@/hooks/web/useDesign'

defineOptions({ name: 'ContentWrap' })

const { getPrefixCls } = useDesign()

const prefixCls = getPrefixCls('content-wrap')

defineProps({
  title: propTypes.string.def(''),
  message: propTypes.string.def(''),
  hideFooter:propTypes.bool.def(true),
  hideHeader:propTypes.bool.def(false),
})
</script>

<template>
  <ElCard :class="[prefixCls, 'mb-15px','mdp-card']" shadow="never">
    <template v-if="!hideHeader"  #header> 
      <slot name="header"></slot> 
    </template> 
    <slot></slot> 
    <template v-if="!hideFooter" #footer>
      <slot name="footer"></slot>
    </template>
  </ElCard>
</template>
<style lang="scss">
.mdp-card {
  .el-card__header {   
    padding-top:5px;
    padding-bottom: 5px;  
  }
}

</style> 
